<template>
  <div>
    <el-button type="primary" @click="dialogTableVisible = true">修改</el-button>
    <el-dialog v-el-drag-dialog title="修改" :visible.sync="dialogTableVisible">
      <el-form  ref="editData" label-position="left" label-width="70px" style='width: 400px; margin-left:50px;'>
        <el-form-item :label="'标题'" prop="title">
          <el-input placeholder="标题" v-model="editData.title"></el-input>
        </el-form-item>
        <el-form-item :label="'名字'" prop="name">
          <el-input v-model="editData.name"></el-input>
        </el-form-item>
        <el-form-item :label="'vue路由'" prop="path">
          <el-input placeholder="vue路由" v-model="editData.path"></el-input>
        </el-form-item>
        <el-form-item :label="'重定向地址'" prop="redirect">
          <el-input v-model="editData.redirect"></el-input>
        </el-form-item>
        <el-form-item :label="'显示根路由'" prop="alwaysShow">
          <el-input v-model="editData.alwaysShow"></el-input>
        </el-form-item>
        <el-form-item :label="'在侧边栏线上'" prop="hidden">
          <el-input v-model="editData.hidden"></el-input>
        </el-form-item>
        <el-form-item :label="'主菜单'" prop="ismain">
          <el-input v-model="editData.ismain"></el-input>
        </el-form-item>
        <el-form-item :label="'图标'" prop="icon">
          <el-input v-model="editData.icon"></el-input>
        </el-form-item>
        <el-form-item :label="'缓存(默认 false)'" prop="nocache">
          <el-input v-model="editData.nocache"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="submitForm('editData')">立即创建</el-button>
          <el-button @click="close()">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
  import elDragDialog from '@/directive/el-dragDialog' // base on element-ui

  export default {
    name: 'dragDialog-demo',
    directives: { elDragDialog },
    props: ['row_data'],
    data() {
      return {
        dialogTableVisible: false,
        editData: {
        }
      }
    },
    created: function() {
      console.log(this.row_data)
      this.editData = this.row_data
    },
    methods: {
      submitForm(formName) {
        alert(this.editData.id)
        alert('submit!')
      },
      close() {
        this.dialogTableVisible = false
      }
    }
  }
</script>
